<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Remote Browser</title>
    <link rel="stylesheet" href="assets/app.css">
    <script src="assets/socket.io.js" defer></script>
    <script src="assets/bind-events.js" defer></script>
    <script src="assets/app.js" defer></script>
  </head>
  <body>
    <noscript>This page requires JavaScript!</noscript>

    <div class="welcome">Click here to start browsing!</div>

    <div class="browsing">
      <div class="toolbar">
        <div class="network">
          <span class="speed">0</span>
          <span class="unit">KB/S</span>
        </div>

        <svg class="icon" viewBox="0 0 24 24">
          <path fill="#000000" d="M17.9,17.39C17.64,16.59 16.89,16 16,16H15V13A1,1 0 0,0 14,12H8V10H10A1,1 0 0,0 11,9V7H13A2,2 0 0,0 15,5V4.59C17.93,5.77 20,8.64 20,12C20,14.08 19.2,15.97 17.9,17.39M11,19.93C7.05,19.44 4,16.08 4,12C4,11.38 4.08,10.78 4.21,10.21L9,15V16A2,2 0 0,0 11,18M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2Z" />
        </svg>

        <input
          class="url"
          name="url"
          placeholder="URL"
          type="url"
        >
      </div>

      <hr>

      <div class="stream">
        <div class="hover"></div>
        <video class="video"></video>
      </div>
    </div>
  </body>
</html>
